<template lang="">
    <div class="maps" ref="myMap">
      <h1>你好</h1>
    </div>
</template>
<script>
import * as echarts from "echarts";
import "@/assets/js/world.js"             //地图模板
import { data } from "@/assets/js/data"     //地图中各个国家病例数据
export default {
  mounted() {
    let myChart = echarts.init(this.$refs.myMap)
    let option = {
      //视图映射
      visualMap: {
        type: "piecewise",        //分块
        min: 0,
        max: 1400000,
        textStyle:{               //视图映射中文本样式
          color:"#6c7cbf"
        }
      },
      //系列
      series: [
        {
          type: "map",            //类型
          mapType: "world",       //世界地图
          data: data
        }
      ]
    }

    myChart.setOption(option)

    //调整地图的缩放
    window.addEventListener("resize",()=>{
      myChart.resize()
    })
  }

}
</script>
<style lang="less" scoped>
.maps {
  width: 500px;
  height: 500px;
  // border: 1px solid #fff;
  margin: 0 auto;

}
</style>